<!--
 * @Autor: Hongting Yuan
 * @Date: 2021-12-11 14:41:19
 * @LastEditors: Hongting Yuan
 * @LastEditTime: 2021-12-14 19:59:02
 * @LastEditors: Hongting Yuan
 * @LastEditTime: 2021-12-12 11:00:27
 * @Description: file content
 * @FilePath: \Management-of-Scientific-Research-in-Universities-Front-master\src\views\myproject\LargeDataScreen.vue
-->
<template>
  <div>
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ name:'WorkPlace' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>我的项目</el-breadcrumb-item>
      <el-breadcrumb-item>数据大屏</el-breadcrumb-item>
    </el-breadcrumb>
    <el-card>
      <!-- 我的项目详情 -->
      <echarts :chart-data="Data1" autoresize :style="meStyle1" />
      <!-- 成果详情 -->
      <echarts :chart-data="Data2" autoresize :style="meStyle2" />
      <!-- 一周登录详情 -->
      <echarts :chart-data="Data3" autoresize :style="meStyle3" />
      <!-- 学院成果详情 -->
      <echarts :chart-data="Data4" autoresize :style="meStyle4" />
      <!-- 考核方案详情 -->
      <echarts :chart-data="Data5" autoresize :style="meStyle5" />
    </el-card>

  </div>
</template>
<script>
import axios from 'axios'
import echarts from '../../components/MEcharts/echarts.vue'
export default {
  components: {
    echarts
  },
  data() {
    return {
      departnum: [],
      textDepartmentList: [],
      departmentList: [],
      // <!-- 我的项目详情 -->
      meStyle1: {
        width: '19%',
        height: '350px',
        float: 'left'
      },
      // <!-- 成果详情 -->
      meStyle2: {
        width: '19%',
        height: '350px',
        float: 'left'
      },
      // <!-- 一周登录详情 -->
      meStyle3: {
        width: '50%',
        height: '350px',
        float: 'left'
      },
      meStyle4: {
        width: '60%',
        height: '350px',
        float: 'left'
      },
      // <!-- 考核方案详情 -->
      meStyle5: {
        width: '30%',
        height: '350px',
        float: 'left'
      },
      schemeList: [],
      userid: 1,
      // <!-- 我的项目详情 -->
      Data1: {
        title: {
          text: '我的项目详情',
          subtext: 'Fake Data',
          // left: 'center',
          x: 'center',
          y: 'bottom'
        },
        tooltip: {
          trigger: 'item'
        },
        legend: [{
          orient: 'vertical',
          x: '0%',
          data: ['已申请', '通过初审', '通过二审']
        }, {
          orient: 'vertical',
          x: '40%',
          data: ['已结题', '项目完成']
        }],
        series: [
          {
            name: '项目状态数',
            type: 'pie',
            radius: ['40%', '70%'],
            avoidLabelOverlap: false,
            itemStyle: {
              borderRadius: 10,
              borderColor: '#fff',
              borderWidth: 2
            },
            label: {
              show: false,
              position: 'center'
            },
            emphasis: {
              label: {
                show: true,
                fontSize: '25',
                fontWeight: 'bold'
              }
            },
            labelLine: {
              show: false
            },
            data: [
              { value: 0, name: '已申请' },
              { value: 0, name: '通过初审' },
              { value: 0, name: '通过二审' },
              { value: 0, name: '已结题' },
              { value: 0, name: '项目完成' }
            ]
          }
        ]
      },
      // <!-- 成果详情 -->
      Data2: {
        title: {
          text: '成果详情',
          subtext: 'Fake Data',
          // left: 'center',
          x: 'center',
          y: 'bottom'
        },
        tooltip: {
          trigger: 'item'
        },
        legend: {
          orient: 'vertical',
          left: 'left'
        },
        series: [
          {
            name: '成果数',
            type: 'pie',
            radius: '70%',
            data: [
              { value: 0, name: '论文成果' },
              { value: 0, name: '专利成果' },
              { value: 0, name: '获奖成果' }
            ],
            emphasis: {
              itemStyle: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)'
              }
            }
          }
        ]
      },
      // <!-- 一周登录详情 -->
      Data3: {
        title: {
          text: '登录详情',
          subtext: 'Fake Data',
          // left: 'center',
          x: 'center',
          y: 'bottom'
        },
        tooltip: {
          trigger: 'item'
        },
        xAxis: {
          type: 'category',
          data: ['2001-01-11', '2001-01-12', '2001-01-13', '2001-01-14', '2001-01-15', '2001-01-16', '2001-01-17']
        },
        yAxis: {
          type: 'value'
        },
        series: [
          {
            name: '登录次数',
            data: [0, 0, 0, 0, 0, 0, 0],
            type: 'line'
          }
        ]
      },
      // <!-- 学院成果详情 -->
      Data4: {
        title: {
          text: '成果详情',
          subtext: 'Fake Data',
          // left: 'center',
          x: 'center',
          y: 'bottom'
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow'
          }
        },
        grid: {
          left: '3%',
          right: '4%',
          bottom: '10%',
          containLabel: true
        },
        xAxis: [
          {
            type: 'category',
            data: [
              '计算机科学学院',
              '工学院',
              '文学院',
              '数学学院',
              '商学院',
              '经济与管理学院',
              '法学院',
              '应用技术学院',
              '继续教育学院',
              '工学院',
              '历史文化与旅游学院',
              '心理学院',
              '化学与材料科学学院',
              '服装与设计艺术学院',
              '体育学院',
              '舞蹈学院',
              '音乐学院',
              '美术学院',
              '教育科学学院',
              '国际教育学院',
              '影视与传媒学院',
              '地理与资源科学学院',
              '生命科学学院',
              '物理与电子工程学院',
              '马克思主义学院',
              '外国语学院'],
            axisTick: {
              alignWithLabel: true
            }
          }
        ],
        yAxis: [
          {
            type: 'value'
          }
        ],
        series: [
          {
            name: '学院成果数',
            type: 'bar',
            barWidth: '60%',
            data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
          }
        ]
      },
      // <!-- 考核方案详情 -->
      Data5: {
        title: {
          text: '考核方案详情',
          subtext: 'Fake Data',
          // left: 'center',
          x: 'center',
          y: 'bottom'
        },
        legend: {
          data: ['Allocated Budget', 'Actual Spending']
        },
        tooltip: {
          trigger: 'item'
        },
        grid: {
          bottom: '10%'
        },
        radar: {
          // shape: 'circle',
          indicator: [
            { name: '', max: 50 },
            { name: '', max: 50 },
            { name: '', max: 50 },
            { name: '', max: 50 },
            { name: '', max: 50 },
            { name: '', max: 50 },
            { name: '', max: 50 },
            { name: '', max: 50 },
            { name: '', max: 50 },
            { name: '', max: 50 },
            { name: '', max: 50 },
            { name: '', max: 50 },
            { name: '', max: 50 }
          ]
        },
        series: [
          {
            name: '考核方案',
            type: 'radar',
            data: [
              {
                value: [1, 2, 3, 4, 5, 6, 7, 6, 5, 4, 3, 2, 1],
                name: '考核方案'
              }
            ]
          }
        ]
      }

    }
  },
  created() {
    this.userid = this.$store.getters.getuserId
    this.getuserprojects()
    this.getAchievement()
    this.getSchemeList()
    this.textDepartmentList = JSON.parse(this.$store.getters.getdepartment)
    for (var i = 0; i < this.textDepartmentList.length; i++) {
      if (this.textDepartmentList[i] != null) {
        this.departmentList.push(this.textDepartmentList[i])
      }
    }
    this.getdepatdata()
    this.getadata()
    // this.getuserprojects()
  },
  mounted() {

  },
  methods: {
    /**
     * @description: 获取项目状态数据
     * @param {*}
     * @return {*}
     * @author: Hongting Yuan
     */
    getuserprojects() {
      axios.get('/project/', { params: { userId: this.userid, pageSize: 999 }})
        .then(res => {
          if (res.data.data) {
            this.projectlist = res.data.data.list
            for (var i = 0; i < this.projectlist.length; i++) {
              if (this.projectlist[i].statusId === 1) {
                this.Data1.series[0].data[0].value++
              } else if (this.projectlist[i].statusId === 2) {
                this.Data1.series[0].data[1].value++
              } else if (this.projectlist[i].statusId === 3) {
                this.Data1.series[0].data[2].value++
              } else if (this.projectlist[i].statusId === 4) {
                this.Data1.series[0].data[3].value++
              } else if (this.projectlist[i].statusId === 5) {
                this.Data1.series[0].data[4].value++
              }
            }
          }
        })
        .catch(err => {
          console.error(err)
        })
    },
    /**
     * @description: 获取成果详情数据
     * @param {*}
     * @return {*}
     * @author: Hongting Yuan
     */
    getAchievement() {
    // 论文成果数目
      axios.get('/achievement/searchAllPass/paper?pageNum=1&pageSize=1')
        .then(res => {
          this.Data2.series[0].data[0].value = res.data.data.total
          console.log(res.data.data.total) // 这个值
        })
        .catch(err => {
          console.error(err)
        })

      // 专利成果数目
      axios.get('/achievement/searchAllPass/patent?pageNum=1&pageSize=1')
        .then(res => {
          this.Data2.series[0].data[1].value = res.data.data.total
          console.log(res.data.data.total) // 这个值
        })
        .catch(err => {
          console.error(err)
        })

      // 获奖成果数目
      axios.get('/achievement/searchAllPass/awarded?pageNum=1&pageSize=1')
        .then(res => {
          this.Data2.series[0].data[2].value = res.data.data.total
          console.log(res.data.data.total) // 这个值
        })
        .catch(err => {
          console.error(err)
        })
    },
    /**
     * @description: 获取考核方案详情
     * @param {*}
     * @return {*}
     * @author: Hongting Yuan
     */
    getSchemeList() {
      axios.get('/assessment/getAllProgram')
        .then(res => {
          if (res.data.code !== 200) return this.$message.error('获取考核方案失败')
          // this.schemeList = res.data
          // var sum = 0
          this.schemeList = []
          var index = 0
          for (var i = 0; i < res.data.data.list.length; i++) {
            for (var j = 0; j < res.data.data.list[i].categoryList.length; j++) {
              this.Data5.series[0].data[0].value[index] = res.data.data.list[i].categoryList[j].score
              this.Data5.radar.indicator[index].name = res.data.data.list[i].categoryList[j].categoryName
              index++
              // const objectScheme = {}
              // objectScheme.atName = res.data.data.list[i].atName
              // objectScheme.categoryName = res.data.data.list[i].categoryList[j].categoryName
              // objectScheme.atId = res.data.data.list[i].atId
              // objectScheme.categoryId = res.data.data.list[i].categoryList[j].categoryId
              // objectScheme.score = res.data.data.list[i].categoryList[j].score
              // self.schemeList.push(objectScheme)
              this.schemeList.push(res.data.data.list[i].categoryList[j].score)
            }
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    /**
     * @description: 获取学院数据
     * @param {*}
     * @return {*}
     * @author: Hongting Yuan
     */
    getdepatdata() {
      // 各学院
      var depart = [
        '计算机科学学院',
        '工学院',
        '文学院',
        '数学学院',
        '商学院',
        '经济与管理学院',
        '法学院',
        '应用技术学院',
        '继续教育学院',
        '工学院',
        '历史文化与旅游学院',
        '心理学院',
        '化学与材料科学学院',
        '服装与设计艺术学院',
        '体育学院',
        '舞蹈学院',
        '音乐学院',
        '美术学院',
        '教育科学学院',
        '国际教育学院',
        '影视与传媒学院',
        '地理与资源科学学院',
        '生命科学学院',
        '物理与电子工程学院',
        '马克思主义学院',
        '外国语学院']
      axios.get(`/assessment/getAllProject?pageNum=1&pageSize=999`)
        .then(res => {
          // this.departnum = []
          var alllist = []
          var self = this
          if (res.data.code !== 200) return this.$message.error('获取考核结果失败')
          if (res.data.data && res.data.data.list) {
            alllist = self.getdepartList(res)
          }

          // for (var i = 0; i < depart.length; i++) {
          //   this.departnum[i] = 0
          // }

          for (var i = 0; i < alllist.length; i++) {
            for (var j = 0; j < depart.length; j++) {
              if (alllist[i].department === depart[j]) {
                self.Data4.series[0].data[j]++
                // this.departnum[j]++
              }
            }
          }
          // 获取各学院的数量
          console.log(this.departnum)
        })
        .catch(err => {
          console.log(err)
        })
    },
    /**
     * @description: 获取部门列表
     * @param {*} res
     * @return {*}
     * @author: Hongting Yuan
     */
    getdepartList(res) {
      var self = this
      var resultList = []
      self.totalNum = res.data.data.list.length
      for (var i = 0; i < res.data.data.list.length; i++) {
        const objectResult = {}
        objectResult.department = this.departmentList[res.data.data.list[i].projectVo.departmentId - 2].name
        resultList.push(objectResult)
      }
      return resultList
    },
    /**
     * @description: 获取近7天登录详情
     * @param {*}
     * @return {*}
     * @author: Hongting Yuan
     */
    getadata() {
      // 近七天的日期
      // var dateArray = []
      // 近七天的登录数
      var numArray = []

      for (var i = 0; i < 7; i++) {
        numArray[i] = 0
      }
      this.Data3.xAxis.data[0] = this.getDay(-6)
      this.Data3.xAxis.data[1] = this.getDay(-5)
      this.Data3.xAxis.data[2] = this.getDay(-4)
      this.Data3.xAxis.data[3] = this.getDay(-3)
      this.Data3.xAxis.data[4] = this.getDay(-2)
      this.Data3.xAxis.data[5] = this.getDay(-1)
      this.Data3.xAxis.data[6] = this.getDay(0)

      // var co = 0
      // for (var j = 0; j < 7; j++) {
      //   axios.post('/log/searchByTime/userLoginLog', {
      //     'startTime': this.Data3.xAxis.data[j] + ' 00:00:00',
      //     'endTime': this.Data3.xAxis.data[j] + ' 23:59:59',
      //     'pageNum': 1,
      //     'pageSize': 1
      //   })
      //     .then(res => {
      //       this.Data3.series[0].data[j] = res.data.data.total
      //       console.log(j)
      //     })
      //     .catch(err => {
      //       console.error(err)
      //     })
      // }
      var yu = new Date(this.Data3.xAxis.data[0] + ' 00:00:00')
      var time1 = yu.getTime()

      yu = new Date(this.Data3.xAxis.data[1] + ' 00:00:00')
      var time2 = yu.getTime()

      yu = new Date(this.Data3.xAxis.data[2] + ' 00:00:00')
      var time3 = yu.getTime()

      yu = new Date(this.Data3.xAxis.data[3] + ' 00:00:00')
      var time4 = yu.getTime()

      yu = new Date(this.Data3.xAxis.data[4] + ' 00:00:00')
      var time5 = yu.getTime()

      yu = new Date(this.Data3.xAxis.data[5] + ' 00:00:00')
      var time6 = yu.getTime()

      yu = new Date(this.Data3.xAxis.data[6] + ' 00:00:00')
      var time7 = yu.getTime()
      var alllist = []
      axios.post('/log/searchByTime/userLoginLog', {
        'startTime': this.Data3.xAxis.data[0] + ' 00:00:00',
        'endTime': this.Data3.xAxis.data[6] + ' 23:59:59',
        'pageNum': 1,
        'pageSize': 9999
      })
        .then(res => {
          alllist = res.data.data.list
          console.log(alllist)
          this.Data3.series[0].data[0] = alllist.filter((val) => {
            return val.loginTime >= time1 && val.loginTime < time2
          })
          this.Data3.series[0].data[1] = alllist.filter((val) => {
            return val.loginTime >= time2 && val.loginTime < time3
          })
          this.Data3.series[0].data[2] = alllist.filter((val) => {
            return val.loginTime >= time3 && val.loginTime < time4
          })
          this.Data3.series[0].data[3] = alllist.filter((val) => {
            return val.loginTime >= time4 && val.loginTime < time5
          })
          this.Data3.series[0].data[4] = alllist.filter((val) => {
            return val.loginTime >= time5 && val.loginTime < time6
          })
          this.Data3.series[0].data[5] = alllist.filter((val) => {
            return val.loginTime >= time6 && val.loginTime < time7
          })
          this.Data3.series[0].data[6] = alllist.filter((val) => {
            return val.loginTime >= time7
          })

          this.Data3.series[0].data[0] = this.Data3.series[0].data[0].length
          this.Data3.series[0].data[1] = this.Data3.series[0].data[1].length
          this.Data3.series[0].data[2] = this.Data3.series[0].data[2].length
          this.Data3.series[0].data[3] = this.Data3.series[0].data[3].length
          this.Data3.series[0].data[4] = this.Data3.series[0].data[4].length
          this.Data3.series[0].data[5] = this.Data3.series[0].data[5].length
          this.Data3.series[0].data[6] = this.Data3.series[0].data[6].length
          console.log(this.Data3.series[0].data)
        })
        .catch(err => {
          console.error(err)
        })
    },
    /**
     * @description: 日期转换
     * @param {*}
     * @return {*}
     * @author: Hongting Yuan
     */
    // getDay(0);//当天日期   getDay(-7);//7天前日期   getDay(0);//当天日期   getDay(-3);//3天前日期
    getDay(day) {
      var today = new Date()
      var targetday_milliseconds = today.getTime() + 1000 * 60 * 60 * 24 * day
      today.setTime(targetday_milliseconds) // 注意，这行是关键代码
      var tYear = today.getFullYear()
      var tMonth = today.getMonth()
      var tDate = today.getDate()
      tMonth = this.doHandleMonth(tMonth + 1)
      tDate = this.doHandleMonth(tDate)
      return tYear + '-' + tMonth + '-' + tDate
    },
    /**
     * @description: 月份转换
     * @param {*} month
     * @return {*}
     * @author: Hongting Yuan
     */
    doHandleMonth(month) {
      var m = month
      if (month.toString().length === 1) {
        m = '0' + month
      }
      return m
    }

  }

}
</script>

<style>
</style>

